<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head xmlns:th="http://www.thymeleaf.org" th:include="master::head">
    <title>添加PageInfo</title>
</head>
<body>
<div class="container">
    <div class="row">
        <form class="form" action="saveUrlRule" method="post">
            <div class="form-body">
                <div class="form-group">
                    <input type="hidden" th:value="${regionInfo.id}" name="regionId"/>
                    <input type="hidden" value="urlRule" name="ruleType"/>
                    <label class="control-label" th:text="${'区域名称:'+regionInfo.name}">  </label>
                </div>
                <div class="form-group">
                    <label class="control-label">Url解析表达式</label>
                    <input type="text" class="form-control" id="urlRule" name="rule"
                           value="links().regex(.*dxx.php?.*).all()"/></div>
                <div class="form-group">
                    <label class="control-label">请求方式</label>
                    <select name="method" class="bootstrap-select bs-select">
                        <option value="GET" selected="selected">get方式</option>
                        <option value="POST">post方式</option>
                        <option value="PUT">put方式</option>
                        <option value="DELETE">delete方式</option>
                    </select>
                </div>
            </div>
            <div class="form-actions">
                <button id="btnTest" type="button" class="btn green test">测试</button>
                <button id="btnSubmit" type="submit" class="btn primary save">保存</button>
            </div>
        </form>
        <textarea class="testResult form-control " rows="7"></textarea>
    </div>

</div>
<script th:inline="javascript">
    /*<![CDATA[*/
    $(function () {
        $("#btnTest").click(function () {
            var form = $(this).closest("form");
            var data = {};
            form.serializeArray().map(function (x) {
                data[x.name] = x.value;
            });
            data.scope = "url";
            $.ajax({
                type: "post",
                cache: false,
                contentType: "application/json",
                url: global.contextPath + "/testPageWithRule",
                data: JSON.stringify(data),
                dataType: 'json',
                success: function (result) {     //回调函数，result，返回值
                    $(".testResult").val(JSON.stringify(result, null, "\t"));
                },
                error: function (msg) {
                    alert("测试出现异常！");
                    console.log(msg);
                }
            });
        });
        $(".form").submit(function () {
            var form = $(this);
            var data = {};
            form.serializeArray().map(function (x) {
                data[x.name] = x.value;
            });
            $.ajax({
                type: "post",
                cache: false,
                contentType: "application/json",
                url: form.attr("action"),
                data: JSON.stringify(data),
                dataType: 'json',
                success: function (data) {     //回调函数，result，返回值
//                    form.resetForm();
                    alert(data == true ? "提交成功!" : "提交失败！");
                },
                error: function (msg) {
                    alert("提交出现异常！");
                    console.log(msg);
                }
            });
            return false;
        });
    });

    /*]]>*/
</script>

</body>
</html>